<template>
	<view>
		<!-- <tui-skeleton v-if="skeletonShow" :isLoading="false" backgroundColor="#fafafa" borderRadius="10rpx"></tui-skeleton> -->
		<view class="container tui-skeleton">
			<!--悬浮头部-->
			<view class="tui-header" :style="{height: `${statusBar.top + statusBar.height + 10}px`}">
				<view class="header-placeholder" :style="{height: `${statusBar.top}px`}"></view>
				<view class="header-content" :style="{height: `${statusBar.height}px`, top: `${statusBar.top}px`}">
					<tui-icon
						name="home-fill"
						color="#FFF"
						:size="22"
						@tap="HANDLE_JUMP_HOME"
						class="home-btn">
					</tui-icon>
				</view>
				<view class="bg-wrapper">
					<image
						src="https://www.thorui.cn/wx/static/images/mall/my/img_bg_3x.png"
						class="header-bg"
						mode="aspectFill"></image>
				</view>
			</view>
			<!--banners-->
			<view class="tui-header-banner" :style="{ height: `${statusBar.top + 208}px` }">
				<view class="banner-content" :style="{top: `${statusBar.top + statusBar.height + 10}px`}">
					<view class="content-item">
						<view class="item-label">
							<view class="label-txt">本月</view>
							<view class="label-txt">销售额</view>
						</view>
						<view class="item-price larger-price">
							{{totalSaleAmount}}
						</view>
						<view class="earnings-detail-btn" @tap='doJump(`returnsDetail/returnsDetail?total=${totalSaleAmount}`)'>
							查看明细
						</view>
					</view>
					<view class="content-item">
						<view class="item-label">
							本月预估代理费
						</view>
						<view class="item-price">
							{{selfProfit}}
						</view>
						<!-- <view class="item-label second-label">
							返现
						</view>
						<view class="item-price">
							{{crashBack}}
						</view> -->
					</view>
				</view>
				<image src="https://www.thorui.cn/wx/static/images/mall/my/img_bg_3x.png" :style="{ height: `${statusBar.top + 208}px` }" class="banner-bg"  mode="aspectFill"></image>
			</view>
			<view class="tui-body-container">
				<view class="tui-entry-wapper">
					<view class="entry-item" @tap="doJump('account/account')">
						<view class="entry-img-wrapper">
							<image src="https://cwmall.oss-cn-shanghai.aliyuncs.com/mp-icon/proxy/yue.png" class="entry-img" mode="aspectFill"></image>
						</view>
						<view class="entry-label">
							我的帐户
						</view>
					</view>
					<view class="entry-item" @tap="doJump('customerList/customerList')">
						<view class="entry-img-wrapper">
							<image src="https://cwmall.oss-cn-shanghai.aliyuncs.com/mp-icon/proxy/geren.png" class="entry-img" mode="aspectFill"></image>
						</view>
						<view class="entry-label">
							客户管理
						</view>
					</view>
					<view class="entry-item" @tap="doJump('orderList/orderList')">
						<view class="entry-img-wrapper">
							<image src="https://cwmall.oss-cn-shanghai.aliyuncs.com/mp-icon/proxy/jilu.png" class="entry-img" mode="aspectFill"></image>
						</view>
						<view class="entry-label">
							客户订单
						</view>
					</view>
					<view class="entry-item" @tap="doJump('lowLevel/lowLevel')">
						<view class="entry-img-wrapper">
							<image src="https://cwmall.oss-cn-shanghai.aliyuncs.com/mp-icon/proxy/aixin.png" class="entry-img" mode="aspectFill"></image>
						</view>
						<view class="entry-label">
							下级管理
						</view>
					</view>
				</view>
			</view>
			<custom-tab-bar name='proxy'></custom-tab-bar>
		</view>
	</view>
</template>

<script>
	import MainMixin from './home.js'
	import CustomTabBar from "@/components/common/custom-tabbar/custom-tabbar.vue"
	export default {
		components: { CustomTabBar },
		mixins: [MainMixin]
	}
</script>

<style lang="scss">
@import "./style.scss";
</style>
